{% extends 'base.html' %}

{% block content %}
<style>
  .list_item {
        margin-top: 5px;
        padding: 5px;
      }
  a {
        text-decoration: none;
        color: black;
        font-size: 25px;
      }
</style>
    <form method="POST" action="/comments/" class = "mt-3 text-center">
        {% csrf_token %}
        <div type="search" class="form-control">
            Оставить отзыв : {{form.text}}<br>
        </div>
        <button type = submit class = "btn btn-success mt-3">Отправить</button>
    </form>
    <div class="row row-cols-1 mt-1" >
      {% for comment in comments %}
      <div class="col p-2">
          <a class="card"  style="border-radius: 10px;">
            <div class="card-body">
              <p> <img src = "https://liubimyi-sad.ru/wp-content/themes/liubimyi-sad/img/avatar.png" class = "img-fluid"> {{ comment.text }}</p>
              <b class="card-text p-3">{{ comment.author }}</b>
            </div>
          </a>
      </div>
    {% endfor %}

  </div>

{% endblock %}
